<%include file="header.html"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>highcharts</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />

		<link rel="stylesheet" href="<%$staticUrl%>css/bootstrap.min.css" />
		<link rel="stylesheet" href="<%$staticUrl%>css/font-awesome.min.css" />
		<link rel="stylesheet" href="<%$staticUrl%>css/ace.min.css" />
		<link rel="stylesheet" href="<%$staticUrl%>css/ace-rtl.min.css" />
		<link rel="stylesheet" href="<%$staticUrl%>css/ace-skins.min.css" />
		<link rel="stylesheet" href="<%$staticUrl%>/css/dropzone.css" />
		<link rel="stylesheet" href="<%$staticUrl%>css/jquery-ui-1.10.3.custom.min.css" />

<!--		
   <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
  <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script>
  <script type="text/javascript" src="http://cdn.hcharts.cn/highcharts/exporting.js"></script>
-->
  
  <script type="text/javascript" src="<%$staticUrl%>js/chart/highcharts.js"></script>
  <script type="text/javascript" src="<%$staticUrl%>js/chart/modules/exporting.js"></script>
	
		<style>
		a:hover  {
		    text-decoration: none;
		}

		select {
		width:85px;
		}

		</style>
	</head>
 
  
	<body class="login-layout">
	
		<div id="container" ></div>
		
	</body>
	<script type="text/javascript">
	$(function () {
		$('#container').css({'width':'100%' , 'height':'600px'});
	    $('#container').highcharts({
        chart: {
            zoomType: 'x',
            spacingRight: 30
        },
        title: {
            text: '飞狐游戏实时数据'
        },
        subtitle: {
            text: document.ontouchstart === undefined ?
                '' :
                ''
        },
        xAxis: {
			type: 'datetime',
            //maxZoom: 14 * 24 * 3600000, // fourteen days
            dateTimeLabelFormats: {
               // day: '%b-%e'
                minute: '%M'
            },
           // title: {
           //     text: null
           // }
		   staggerLines:10,
		   labels:{ 
				step:1,
			},
			
			//categories: ['00:00','00:30', '01:00','01:30','02:00','02:30','03:00','03:30','04:00','04:30','05:00','06:30','07:00','08:30','09:00','09:30','10:00','05:00','06:30','07:00','08:30','09:00','09:30','10:00'],
            tickLength: 1,
			
			maxPadding : 0.005,  
            minPadding : 0.005,  
            tickWidth:1,//刻度的宽度  
            lineWidth :1,//自定义x轴宽度  
            gridLineWidth :0,//默认是0，即在图上没有纵轴间隔线  
			tickPixelInterval:150,
		    minTickInterval:1,
			gridLineWidth:1,
        },
        yAxis: {
			labels:{ 
				step:1,
			}, 
            //max:300, // 定义Y轴 最大值  
            title: {
                text: '充值金额(元)'
            },
        },
        tooltip: {
            shared: true
        },
        labels: {
            enabled: false
        },
		
        plotOptions: {
            area: {
                fillColor: {
                    linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1},
                    stops: [
                        [0, Highcharts.getOptions().colors[0]],
                        [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]
                    ]
                },
                lineWidth: 1,
                marker: {
                    enabled: false
                },
                shadow: false,
                states: {
                    hover: {
                        lineWidth: 1
                    }
                },
                threshold: null
            }
        },
	
        series: [{
            //type: 'area',
            name: '实时充值趋势图',
           pointInterval: 1 * 900 * 1000,
           pointStart: Date.UTC(2015, 05, 30),
            data: [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,10,10,10,10,10,10,10,20,20,20,30,60,100]
            	// [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49]
		}]
    });
	});			
	

	</script>
	 <script src="<%$staticUrl%>js/chart/themes/grid.js"></script>
</html>
